<template>
  <div>
    <!--头部模糊查询-->
    <el-row>
      <el-col :span="4"
      >
        <el-input
            v-model="searchForm.name"
            placeholder="请输入教师名称"
            size="mini"
        ></el-input>
      </el-col>
      <el-col :span="4"
      >
        <el-input
            v-model="searchForm.mobile"
            placeholder="请输入教师手机号"
            size="mini"
        ></el-input>
      </el-col>
      <el-col :span="6">
        <el-button
            type="primary"
            icon="el-icon-search"
            @click="loadData()"
            size="mini"
        >搜索
        </el-button
        >
      </el-col>
      <el-col :span="6">
        <el-button
            type="primary"
            icon="el-icon-search"
            @click="flush()"
            size="mini"
        >刷新
        </el-button
        >
      </el-col>
      <el-col :span="4"></el-col>
      <el-col :span="4"></el-col>
      <el-col :span="2"></el-col>
    </el-row>

    <!--表格数据-->
    <el-table :data="tableData" style="width: 100%">
      <el-table-column prop="id" label="序号" width="180">
      </el-table-column>
      <el-table-column prop="name" label="讲师名称" width="180">
      </el-table-column>
      <el-table-column prop="email" label="讲师邮箱"></el-table-column>
      <el-table-column prop="status" label="审核状态">
        <template slot-scope="scope">
          <el-button type="success" size="mini" v-if="scope.row.status == 0">通过</el-button>
          <el-button type="danger" size="mini" v-if="scope.row.status==1">未通过</el-button>
        </template>
      </el-table-column>
<!--      <el-table-column prop="teacherCheckId" label="审核id" width="180">-->
<!--      </el-table-column>-->
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button
              size="mini"
              type="danger"
              @click="handlerCheck(scope.$index, scope.row)">审核
          </el-button>
        </template>
      </el-table-column>

    </el-table>

    <!--分页-->
    <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="pageNo"
        :page-sizes="[1, 2, 3, 4]"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
    >
    </el-pagination>

    <!--审核对话框-->
    <el-dialog
        title="请选择审核结果"
        :visible.sync="dialogVisible"
        width="30%"
        :before-close="handleClose">
      <el-row>

        <el-form ref="form" :model="checkForm" label-width="80px">
            <el-form-item>
              <el-button type="danger" size="mini" @click="audit()">未通过</el-button>
              <el-button type="success" size="mini" @click="audit1()">通过</el-button>
            </el-form-item>
          <el-form-item label="审核内容">
            <el-input type="textarea"  v-model="checkForm.desc" autocomplete="off"></el-input>
          </el-form-item>
        </el-form>
<!--        <el-button type="danger" size="mini" @click="audit()">未通过</el-button>-->
<!--        <el-button type="success" size="mini" @click="audit1()">通过</el-button>-->
      </el-row>

      <span slot="footer" class="dialog-footer">
<!--    <el-button @click="dialogVisible = false">取 消</el-button>-->
<!--    <el-button type="primary" @click="dialogVisible = false">确 定</el-button>-->
  </span>
    </el-dialog>
  </div>
</template>
<script>
export default {
  created() {
    this.loadData();
    this.flush();
  },
  data() {
    return {
      checkForm:{
        desc:''
      },
      tableData: [], //列表数据
      pageNo: 1, //页码   第几页
      pageSize: 5, //每页几条数据
      total: this.total, //总数量
      searchForm: {name: '', mobile: ''},//查询表单
      title: '部门添加',//弹出对话框标题
      dialogFormVisible: false,//弹出对话框是否显示，默认不显示
      form: {},//添加或者更新form对象
      formLabelWidth: '120px',//formLabel的宽度
      dialogVisible: false,
      id:0,
    };
  },
  methods: {
    //加载数据的方法
    loadData() {
      var _this = this;
      //复制 $http官网代码
      //
      _this.$http
          .post("/teacher/queryByPage", {
            pageNo: this.pageNo,
            pageSize: this.pageSize,
            data: this.searchForm
          })
          .then(function (response) {
            if (response.data.code == 200) {
              _this.tableData = response.data.data.list;
              _this.total = response.data.data.total;
              console.log(JSON.stringify(response.data.data.list) + "==================response.data.data.list")
              console.log(JSON.stringify(_this.tableData) + "==================_this.tableData")
            }
          })
          .catch(function (error) {
            console.log(error);
            _this.$message.error("你错了。。。");
          });
    },
    flush() {
      //重新加载数据
      var _this = this;
      _this.searchForm.name=null,
      _this.searchForm.mobile=null
      _this.loadData()
    },
    handlerCheck(index, row) {
      var _this = this;
      //row  当前行数据 如果是第一行  row = {deptId:1,deptName:'管理部'把一行数据赋值给form赋值,description:'店长的事',status:1}
      console.log(index, row);
      //显示对话框
      _this.dialogVisible = true;
      _this.id=row.id
      //alert(JSON.stringify(row.teacherCheckId))
      console.log(_this.id)
    },
    //修改审核结果
    audit(index,row) {
      var _this = this;
      _this.$http
          .put("/teacher/updateStatus?id="+_this.id, {
            // id:_this.id,
            status: 1,
          })
          .then(function (response) {
            if (response.data.code == 200) {
              _this.tableData = response.data.data.list;
              _this.total = response.data.data.total;
              //重新加载数据
              _this.loadData()
              _this.dialogVisible = false;
            }
          })
          .catch(function (error) {
            console.log(error);
            _this.$message.error("你错了。。。");
          });

    },
    audit1(index,row) {
      var _this = this;
      _this.$http
          .put("/teacher/updateStatus", {
            checkContent:_this.checkForm.desc,
            status: 0,
            teacherId:_this.id
          })

          .then(function (response) {
            if (response.data.code == 200) {
              _this.tableData = response.data.data.list;
              _this.total = response.data.data.total;
              //重新加载数据
              _this.loadData()
              _this.dialogVisible = false;

            }
          })
          .catch(function (error) {
            console.log(error);
            _this.$message.error("你错了。。。");
          });
    },

    //每页数量发生变化
    handleSizeChange(val) {
      this.pageSize = val;
      this.loadData();
    },
    //页码发生变化
    handleCurrentChange(val) {
      this.pageNo = val;
      this.loadData();
    },
    handleClose(done) {
      this.$confirm('确认关闭？')
          .then(_ => {
            done();
          })
          .catch(_ => {
          });
    }

  },
};
</script>
